<script setup lang="tsx">
import wangEditor from '@/components/wangEditor/index.vue'
import { MessagePlugin } from 'tdesign-vue-next';
definePageMeta({
    layout: 'manager'
})

// 站点信息

// 站点Tab
const tabInfo = ref('basic')

// 基础信息编辑器ref
const basicEditorRef = ref(null);

// 站点基础信息
// 基础信息表格
const siteSettingFormData = reactive({
    basic: {
        flag: 'create',
        name: 'basic',
        content: {
            title: '',
            description: '',
            statistics: '',
            icp: '',
            gaicp: '',
            close: 0,
            close_message: ''
        }
    }
})

// 重置基础信息表单
const onResetBasicFormData = () => { }

// 提交基础信息表单
const onSubmitBasicFormData = () => {
    siteSettingFormData.basic.content.close_message = basicEditorRef?.value?.valueHtml
    // 提交数据
    create_setting(siteSettingFormData.basic).then((res) => {
        MessagePlugin.success({
            content: res.message
        })
        // 刷新路由
        __initialize();
    }).catch((err) => {
        console.log(err);
    })
}

// 页面初始化
const __initialize = () => {
    // 获取站点配置信息
    query_setting({flag: 'all'}).then((res) => {
        if(res.data.length !== 0) {
            siteSettingFormData.basic.content = res.data.basic
        }
    }).catch((err) => {
        console.log(err);
    })
}

onMounted(() => {
    __initialize();
})

</script>

<template>
    <div class="site-container">
        <t-card>
            <t-tabs v-model="tabInfo">
                <t-tab-panel value="basic" label="基础设置">
                    <client-only>

                        <div class="site-basic mt-[30px]">
                            <t-form ref="form" :data="siteSettingFormData.basic" :colon="true"
                                @reset="onResetBasicFormData" @submit="onSubmitBasicFormData">
                                <t-form-item label="站点名称" name="title">
                                    <t-input v-model="siteSettingFormData.basic.content.title"
                                        placeholder="请输入站点名称"></t-input>
                                </t-form-item>

                                <t-form-item label="站点描述" name="desc">
                                    <t-textarea v-model="siteSettingFormData.basic.content.description"
                                        placeholder="请站点描述输入内容" />
                                </t-form-item>

                                <t-form-item label="统计代码" name="statistics">
                                    <t-textarea v-model="siteSettingFormData.basic.content.statistics"
                                        placeholder="请输入站点统计代码" />
                                </t-form-item>

                                <t-form-item label="ICP备案号" name="icp">
                                    <t-input v-model="siteSettingFormData.basic.content.icp"
                                        placeholder="请输入国家工信部备案号"></t-input>
                                </t-form-item>

                                <t-form-item label="公安备案号" name="gaicp">
                                    <t-input v-model="siteSettingFormData.basic.content.gaicp"
                                        placeholder="请输入地方公安备案号"></t-input>
                                </t-form-item>

                                <t-form-item label="关闭站点" name="close">
                                    <t-radio-group v-model="siteSettingFormData.basic.content.close">

                                        <t-radio-button :value="0">允许访问</t-radio-button>
                                        <t-radio-button :value="2">关闭访问</t-radio-button>
                                    </t-radio-group>
                                </t-form-item>

                                <t-form-item label="关闭站点公告" name="close">
                                    <client-only>
                                        <wangEditor ref="basicEditorRef"
                                            :initial-content="siteSettingFormData.basic.content.close_message" />
                                    </client-only>
                                </t-form-item>


                                <t-form-item>
                                    <t-space size="small">
                                        <t-button theme="primary" type="submit">提交</t-button>
                                        <t-button theme="default" variant="base" type="reset">重置</t-button>
                                    </t-space>
                                </t-form-item>
                            </t-form>
                        </div>
                    </client-only>
                </t-tab-panel>
            </t-tabs>
        </t-card>
    </div>
</template>

<style scoped></style>